<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>个人资料</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@1.6/lib/index.css">
		<script src="html5plus://ready"></script>
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/vant@1.6/lib/vant.min.js"></script>	
		<script src="../../js/fanhui.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			#cell{
				border: solid  #C6C6C6 1px;
			}
			#cell .van-cell__value span{
				height: 100px;
				line-height: 100px;
				font-size: 15px;
				color: black;
			}
			#cell .van-cell__right-icon{
				height: 100px;
				line-height: 100px;
				font-size: 15px;
				color: black;
			}
			#cell .van-icon--image{
				width: 100px;
				height: 100px;
			}
			#cell .van-icon--image img{
				width: 100px;
				height: 100px;
				border-radius: 50%;
			}
		</style>
	</head>
	<body>
		<div id="app">
			<header>
				<van-nav-bar @click-left="onClickLeft" style="background-color: red;">
					<van-icon slot="left" name="arrow-left" color="white"></van-icon>
					<label slot="title" style="color: white;">个人资料</label>
				</van-nav-bar>
			</header>
			<section>
				<!-- <van-cell value="更换头像" value-class="center" @click="touxiang">
					<div style="width:100px; height:100px; border-radius:50%; overflow:hidden;" slot="title">
						<img :src="head_src"/>
					</div>
					<van-icon slot="right-icon" name="arrow" class="center"></van-icon>
				</van-cell> -->
				<van-cell id="cell" size="large" title="  " value="更换头像" 
				is-link icon="https://tvax4.sinaimg.cn/crop.0.0.888.888.180/006Dh9Zbly8ft1i9uqjjkj30oo0oo0ue.jpg">
				</van-cell>
				<van-cell :value="nc" title="昵称" is-link>
				</van-cell>
				<van-cell :value="sj" title="手机号码" is-link>
				</van-cell>
			</section>

		</div>
	</body>
	<script type="text/javascript">
		var vm = new Vue({
			el: "#app",
			data: {
				head_src:"../../img/touxiang.jpg",//头像
				nc:"",//昵称
				sj:""//手机号码
			},
			created: function() {
				var _this=this;
				var newUser = localStorage.getItem("user");//从localStorage里取数据(字符串格式)
				newUser = JSON.parse(newUser);//把字符串格式转换成Json格式
				//console.log(newUser);
				if(newUser!=null){
					_this.head_src=newUser.UserData.AvatarImage;//得到用户头像
					_this.nc=newUser.UserData.NickName;//得到用户名
					_this.sj=newUser.UserData.Phone;//得到手机号
				}
			},
			methods: {
				touxiang: function() {

				},
				onClickLeft: function() { //返回个人中心
					plus.webview.close(plus.webview.currentWebview(), "slide-out-left");
				},
				exit: function() {

				}
			}
		})
	</script>
</html>